.ms-markdown {
  a,
  a:hover {
    color: #2f81f7;
  }

  &.markdown-body {
    color: inherit;
    font-size: inherit;
    background: none;

    pre:has(.ms-markdown-code) {
      padding: 0;
      overflow: unset;
      background-color: var(--code-background-fill) !important;
    }

    /* KaTeX */
    span.katex {
      font-size: var(--text-lg);
      direction: ltr;
    }
  }

  & &-select-box-card {
    width: 100%;
    cursor: pointer;

    &-equal-height {
      height: 100%;
    }

    &:hover:not(.ms-markdown-select-box-card-disabled) {
      border-color: var(--primary-300);
    }

    &-disabled {
      color: var(--ant-color-text-disabled);
      cursor: not-allowed;
    }

    &.ms-markdown-select-box-card-selected {
      &:hover {
        border-color: var(--primary-500);
      }

      border-color: var(--primary-500);
    }

    .ant-card-cover {
      margin: 0;
    }

    img,
    .ant-image-mask {
      width: 100% !important;
      border-radius: var(--ant-border-radius-lg) var(--ant-border-radius-lg) 0 0 !important;
    }

    .ant-image {
      width: 100%;

      img {
        width: 100%;
        object-fit: cover;
      }
    }
  }

  & &-select-box-submit-btn {
    margin-top: 8px;

    button {
      background-color: var(--ant-color-primary);
    }
  }

  &-chart {
    width: 100%;
    height: 200px;
  }

  &-heading {
    display: flex;
    align-items: center;

    &-anchor {
      margin-left: -25px;
      padding-right: 8px;
      color: var(--body-text-color-subdued);
      line-height: 1;
      opacity: 0;

      > svg {
        color: var(--body-text-color-subdued);
      }
    }

    &:hover {
      .ms-markdown-heading-anchor {
        opacity: 1;
      }
    }
  }

  &-accordion {
    p,
    li {
      font-size: 16px;
    }

    .ant-collapse-header {
      outline: none !important;
    }
  }

  &-code {
    &-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      width: 100%;
      height: 36px;
      padding: 5px 1em;
      /* stylelint-disable-next-line color-function-alias-notation */
      background-color: rgba(0, 0, 0, 0.03);

      &-copy {
        color: var(--body-text-color-subdued);
        font-size: 17px;
        cursor: pointer;

        &:hover {
          color: var(--body-text-color);
        }
      }
    }

    &&-dark {
      .ms-markdown-code-header {
        background-color: #222;
      }
    }
  }

  .dot-blink() {
    margin-left: 3px;
    color: var(--color-accent);
    font-weight: bold;
    vertical-align: baseline;
    animation: blink 1s steps(5, start) infinite;
    content: '_' !important;
  }
  .handle-elements() {
    .handle() {
      & > p,
      & > dt,
      & > dd,
      & > h1,
      & > h2,
      & > h3,
      & > h4,
      & > h5,
      & > h6,
      & > td,
      & > pre:last-child code {
        &:last-child {
          &::after {
            .dot-blink();
          }
        }
      }
    }

    .handle();

    & > ol:last-child li,
    & > ul:last-child li {
      &:last-child {
        &:not(:has(p, dt, dd, h1, h2, h3, h4, h5, h6, td, pre)) {
          &::after {
            .dot-blink();
          }
        }
        .handle();
      }
    }
  }

  &-flushing {
    .handle-elements();
  }

  &-flushing > .ms-markdown-accordion.ms-markdown-accordion-typing {
    .ms-markdown-accordion-title:last-child,
    .ms-markdown-accordion-body:last-child {
      &-typing-string {
        &::after {
          .dot-blink();
        }
      }

      .handle-elements();
    }
  }

  &-flushing-empty {
    &::after {
      .dot-blink();
    }
  }

  @keyframes blink {
    to {
      visibility: hidden;
    }
  }
}
